<template>
  <div>
    {{ list }}
    {{ lilei }}
    <button @click="change">点击更变</button>
    <button @click="changes">异步改变</button>
    <span>{{doneTodos}}</span>
    <form action="">
        <input type="text" v-model="Form.username">
        <input type="password" v-model="Form.password">
        <button @click="send">发送</button>
         <button @click="To">跳转</button>
    </form>
    
  </div>
</template>
<script>
import { mapState, mapMutations, mapActions,mapGetters} from "vuex";
import Vue from 'vue'
export default {
  data() {
    return {
      list: "我输",
      Form:{
          username:"",
          password:"",
      }
    };
  },
  computed: {
    ...mapState(["lilei","token"]),
    ...mapGetters(['doneTodos'])
  },  
  mounted() {
    //   console.log(this,'适当大使馆的')
      this.$axios.get('/api/sl').then(res =>{
        return res
      })
  },
  methods: {
    ...mapMutations(["update","Sztoken"]),
    ...mapActions(["updates"]),
    change() {
      this.update();
    },
    changes() {
      this.updates();
    },
    send(){
     this.$axios.post('/api/login',this.Form).then(res=>{
         this.Sztoken(res.token);
         Vue.prototype.Token=res.token;
         console.log(this.$store.state.token)
     })
     this.$router.push({
         path:'/login'
     })
    },
    To(){
        if(!this.token){
            console.log('未登录,请登录')
        }else{
            console.log('登录了,随便跳转')
        }
    }
  },
};
</script>
<style scoped>
</style>